<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/taglibs.jsp"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@page import="com.yaodian100.core.common.utils.ServerValue"%>
<head>
	<style type="text/css">
	h1 span{visibility:visible;}
	td span{visibility:visible;}
	.msg{float:left; line-height:1em; margin:0; display:block;border:1px solid #f66;padding:2px 5px;*padding:2px 5px 1px;}
	.msg.rn{background-color:#fff2f2;border-color:#f66;}
	
	.tb_clean {width: 100%;}
	.tb_clean td {border: 0px;}
	.tb_clean td.partition {border-right: 1px solid #DDDDDD;}
	.tb_clean td.partition2 {border-bottom: 1px solid #DDDDDD;}
	.tb_clean td.partitionC {border-right: 1px solid #FF8800;}
	.tb_clean td.partitionC2 {border-bottom: 1px solid #FF8800;}
	</style>
</head>

<s:if test='%{"IDX_BRAND_RECOMMEND".equals(advType)}'>
	<s:set name="searchLink" value='%{"/generate/idxV5/searchIdx.do"}' />
	<s:set name="advTypeTitle" value='%{"首页"}' />
</s:if>
<s:elseif test='%{"PCL_BRAND_RECOMMEND".equals(advType)}'>
	<s:set name="searchLink" value='%{"/generate/idxV5/searchPcl.do"}' />
	<s:set name="advTypeTitle" value='%{"PCLady"}' />
</s:elseif>

<c-rt:set var="midContextPath" value='<%=ServerValue.getMidContextPath() %>'/>
<c-rt:set var="frontHostname" value='<%=ServerValue.getFrontHostname() %>'/>
<%-- 数字验证 --%>
<script type="text/javascript" charset="UTF-8" src="/js/jquery.alphanumeric.js"></script>
<%-- 月历 --%>
<link rel="stylesheet" type="text/css" href="/css/smoothness.datepick.css" />
<script type="text/javascript" charset="UTF-8" src="/js/jquery.datepick.js"></script>
<script type="text/javascript" charset="UTF-8" src="/js/jquery.datepick-zh-CN.js"></script>
<script type="text/javascript" charset="UTF-8" src="/js/yaodian100.common.js"></script>
<script type="text/javascript" charset="UTF-8" src="/js/jquery.autotab-1.1b.js"></script>

<script>
	var BRAND_SIZE = <s:property value="BRAND_SIZE" />;
	var PROD_SIZE = <s:property value="PROD_SIZE" />;
	$().ready( function() {
		<%-- 日历绑定 --%>
		$('#startDate').datepick({minDate: new Date(), showOn:'both',numberOfMonths:2, buttonImageOnly: true, buttonImage: '/images/calendar.gif',dateFormat:"yy-mm-dd"}); 
		$('#endDate').datepick({minDate: new Date(),showOn: 'both',numberOfMonths:2, buttonImageOnly: true, buttonImage: '/images/calendar.gif',dateFormat:"yy-mm-dd"});
		<%-- 输入prodId带出商品小标、品名Ajax --%>
		$('input[id^=brandAdvs_products_prodId_]').each(function() {
			$('#' + this.id).onlyInteger();
			$(this).blur(function(){
				var no = this.id.replace('brandAdvs_products_prodId_', '');
				$(this).val(prodPadLeft($(this).val()));
				getProductInfo3('${midContextPath}', 'brandAdvs_products_prodName_' + no, 'brandAdvs_products_brief_' + no, 'prodIsOk_' + no, $(this).val());
			});
		});
		
		$('#subBtn').click(function() {
			if( validate_data() ) {
				$('#advStatus').val('10');
				$('#idxBrandRecommendForm').submit();
			}
		});

		$("#draftBtn").click(function(){
			if ( validate_data() ){
				$("#advStatus").val("00");
				$("#idxBrandRecommendForm").submit();
			}
		});
		
		$("#canBtn").click(function(){
			if ( validate_data() ){
				$("#advStatus").val("90");
				$("#idxBrandRecommendForm").submit();
			}
		});
		
		$('#bakBtn').click(function() {
			location.href = '${midContextPath}${searchLink}';
		});
		
		$('button[id^=clean_brandImg_]').click(function(event) {
			var no = this.id.replace('clean_brandImg_', '');
			event.preventDefault();
			$('#brandAdvs_brandImg_' + no).val('');
			$('#brandImgCorrect_' + no).val('');
		});
		
		<%-- 验证图档正确 --%>
		$('input[id^=brandAdvs_brandImg_]').change(function() {
			var no = this.id.replace('brandAdvs_brandImg_', '');
			checkImg(this , 5, 125, 40, $('#brandImgCorrect_'+no), '') ;
		});
		<%-- 限制输入中文 --%>
		$('input[id^=textTitle]').bind('keyup', function() {
			this.value = this.value.replace(/[^\u4E00-\u9FA5]/g, '');
		});
		
		$('input[id^=brandAdvs_brandImgAdWord_], input[id^=brandAdvs_products_adWord_]').alphanumeric();
		$('input[id^=brandAdvs_brandImgAdWord_], input[id^=brandAdvs_products_adWord_]').autotab_filter({ format: 'custom', pattern: '[^a-zA-Z0-9]' });
	});
	
	function validate_data(){
		var isCorrect = true; <%-- 预设验证正确 --%>
		
		cleanTip();
		
		for(var i = BRAND_SIZE; i > 0 ; i--) {
			for(var j = PROD_SIZE; j > 0; j--) {
				if( $('#brandAdvs_products_prodName_' + i + '_' + j).val() == '' ) {
					appendTip('brandAdvs_products_prodName_' + i + '_' + j, '请输入'+$('#brand_site_' + i).val()+'商品名称('+$('#prod_site_' + i + '_' + j).val()+')', true);
					isCorrect = false;
				} else if( !vaildateLength(22, $('#brandAdvs_products_brief_' + i + '_' + j).val()) ) {
					appendTip('brandAdvs_products_prodName_' + i + '_' + j, $('#brand_site_' + i).val()+'商品名称('+$('#prod_site_' + i + '_' + j).val()+')最多22个中文，44个英文字母', true);
					isCorrect = false;
				}
				if( $('#brandAdvs_products_brief_' + i + '_' + j).val() == '' ) {
					appendTip('brandAdvs_products_brief_' + i + '_' + j, '请输入'+$('#brand_site_' + i).val()+'商品小标('+$('#prod_site_' + i + '_' + j).val()+')', true);
					isCorrect = false;
				} else if( !vaildateLength(11, $('#brandAdvs_products_brief_' + i + '_' + j).val()) ) {
					appendTip('brandAdvs_products_brief_' + i + '_' + j, $('#brand_site_' + i).val()+'商品小标('+$('#prod_site_' + i + '_' + j).val()+')最多11个中文，22个英文字母', true);
					isCorrect = false;
				}
				if( $('#prodIsOk_' + i + '_' + j).val() == 'N' ) {
					appendTip('brandAdvs_products_prodId_' + i + '_' + j, $('#brand_site_' + i).val()+'商品编号('+$('#prod_site_' + i + '_' + j).val()+')错误', true);
					isCorrect = false;
				}
				if( $('#brandAdvs_products_prodId_' + i + '_' + j).val() == '' ) {
					appendTip('brandAdvs_products_prodId_' + i + '_' + j, '请输入'+$('#brand_site_' + i).val()+'商品编号('+$('#prod_site_' + i + '_' + j).val()+')', true);
					isCorrect = false;
				}
			}

			if( $('#brandAdvs_brandImgLink_' + i).val() == '' ) {
				appendTip('brandAdvs_brandImgLink_' + i, '请输入'+$('#brand_site_' + i).val()+'图档图片点击连结', true);
				isCorrect = false;
			}
			if( $('#brandImgCorrect_' + i).val() != '' ) {
				appendTip('brandAdvs_brandImg_' + i, '请选择符合条件的'+$('#brand_site_' + i).val()+'图档图片', true);
				isCorrect = false;
			}
			if($('#advId').val() == '' && $('#doClone').val() != 'true') {
				if ( $('#brandAdvs_brandImg_' + i).val() == "" ) {
					appendTip('brandAdvs_brandImg_' + i, '请输入上传'+$('#brand_site_' + i).val()+'图档图片', true);
					isCorrect = false;
				}
			}
		}
		
		if($('#startDate').val()>$('#endDate').val()) {
			appendTip('endDate', '结束日期不能小于起始日期', true);
			isCorrect = false;
		} else if($('#startDate').val()==$('#endDate').val()) {
			if($('#startTime').val()>=$('#endTime').val()){
				appendTip('endDate', '结束时间需大于起始时间', true);
				isCorrect = false;
			}
		}
		if( $('#endDate').val() == '' ) {
			appendTip('endDate', '请输入结束时间', true);
			isCorrect = false;
		}
		if( $('#startDate').val() == '') {
			appendTip('startDate', '请输入起始时间', true);
			isCorrect = false;
		}
		if( $('#advName').val() == '' ) {
			appendTip('advName', '请输入广告名称', true);
			isCorrect = false;
		}
		
		if(isCorrect) {
			for(var i = 1; i <= BRAND_SIZE; i++) {
				if ( $("#brandAdvs_brandImg_" + i).val() != "" ) {
					$("#brandAdvs_brandImgName_" + i).val($("#brandAdvs_brandImg_" + i).val());
				}
			}
		}
	
		return isCorrect;
	}
	<%-- 清空提示 --%>
	function cleanTip() {
		$("span:[id^=Tip_]").hide();
		$("span:[id^=Tip_]").text('');
	}
	<%-- 附加提示 --%>
	function appendTip(id, msg, isFocus) {
		if( !(isFocus == true || isFocus == false) ) 
			isFocus = true;
		
		var target = $('#Tip_' + id);
		if(target.text().length > 0) {
			appendWord(target, msg);
		} else
			target.text(msg);
		target.show();
		if(isFocus)
			$('#' + id).focus();
	}
	
	function appendWord(origin, apptext){
		if(origin.text().length==0){
			origin.text(apptext);
		}else{
			origin.text(origin.text()+', '+apptext);
		}
	}
</script>
<s:if test="hasErrors()">
<p><s:actionerror cssClass="msg rn" /></p>
</s:if>
<s:if test="hasActionMessages()">
<p><s:actionmessage cssClass="msg rn" /></p>
</s:if>
<s:if test="hasFieldErrors()">
<p><s:fielderror cssClass="msg rn" /></p>
</s:if>
<h1>广告上架管理</h1>
<s:form action="idxBrandRecommend/saveIdxBrandRecommend.do" method="post" name="idxBrandRecommendForm" id="idxBrandRecommendForm" enctype="multipart/form-data" >
	<table class="tb-data" width="100%">
		<!-- TODO: 插入示意圖 -->
		<tbody>
			<tr>
				<th>类型</th>
				<td>${advTypeTitle} - 品牌推荐区<input type="hidden" name="advType" id="advType" value="${advType}"/></td>
			</tr>
			<tr>
				<th><span class="txt-red">*</span> 广告名称</th>
				<td><input type="text" id="advName" name="advName" value="${advName}" size="50" maxlength="30"/><br/><span id="Tip_advName" class="msg rn" style="display:none;"></span></td>
			</tr>
			<tr>
				<th><span class="txt-red">*</span> 起迄时间</th>
				<td>
				<input type="text" id="startDate" name="startDate" value="${startDate}" maxlength="10"/>
				<select id="startTime" name="startTime">			
					<c-rt:forEach begin="0" end="23" var="t1">
						<c-rt:if test="${t1<10}">
						<c-rt:set value="0${t1}:00" var="sTime"></c-rt:set>
						</c-rt:if>
						<c-rt:if test="${t1>=10}">
						<c-rt:set value="${t1}:00" var="sTime"></c-rt:set>
						</c-rt:if>
						<option value="${sTime}" <c-rt:if test="${sTime==startTime}">selected</c-rt:if>>${sTime}</option>
					</c-rt:forEach>
				</select> ~ 				 
				<input type="text" id="endDate" name="endDate" value="${endDate}" maxlength="10"/>
				<select id="endTime" name="endTime">
					<c-rt:forEach begin="0" end="23" var="t2" >
						<c-rt:set var="t3">${23-t2}</c-rt:set>	
						<c-rt:if test="${t3<10}">
						<c-rt:set value="0${t3}:59" var="eTime"></c-rt:set>
						</c-rt:if>
						<c-rt:if test="${t3>=10}">
						<c-rt:set value="${t3}:59" var="eTime"></c-rt:set>
						</c-rt:if>
						<option value="${eTime}" <c-rt:if test="${eTime==endTime }">selected</c-rt:if>>${eTime}</option>
					</c-rt:forEach>
				</select>
				<br/>
				<span id="Tip_startDate" class="msg rn" style="display:none;"></span><span id="Tip_startTime" class="msg rn" style="display:none;"></span><span id="Tip_endDate" class="msg rn" style="display:none;"></span><span id="Tip_endTime" class="msg rn" style="display:none;"></span>
				</td>
			</tr>
			<tr>
				<td colspan="2"><img src="/eventImg/IDX_BRAND_RECOMMEND.jpg"></td>
			</tr>
			<tr>
				<th colspan="2"><span class="txt-red">*</span> 品牌推荐图档及对应商品设定</th>
			</tr>
			<tr>
				<td colspan="2">
					<table class="tb_clean">
						<s:set name="lc" value="0" />
						<s:set name="rc" value="0" />
						<s:iterator value="brandAdvs" var="adv" status="idx" >
							<s:set name="no" value="%{#idx.index}" />
							<s:set name="i" value="%{#idx.index + 1}" />
							<s:set name="side" value="%{(#i)%2==1?'L':'R'}" />
							<s:set name="tdClass" value="%{'partitionC2'}" />
							<s:if test="%{(#i)%2==1}">
								<s:set name="lc" value="%{#lc+1}" />
								<s:set name="side" value="%{#side + #lc}" />
								<s:set name="tdClass" value="%{#tdClass + ' partitionC'}" />
							</s:if>
							<s:else>
								<s:set name="rc" value="%{#rc+1}" />
								<s:set name="side" value="%{#side + #rc}" />
							</s:else>
							<s:if test="%{(#i)%2==1}"><tr></s:if>
							<td class="<s:property value='#tdClass' />" width="50%">
								<table class="tb_clean">
									<tr>
										<td width="100px"><s:property value="brandSite[#side]" /><input type="hidden" id="brand_site_${i}" value="<s:property value="brandSite[#side]" />"></td>
										<td>
											<s:if test="%{(advId!=null&&advId.trim().length()>0)||doClone}">
											<img src="${frontHostname }/eventImg/${brandAdvs[no].brandImgFolder}/${advType}/${brandAdvs[no].brandImgName}" width="125" height="40"/>
											</s:if>
										</td>
									</tr>
									<tr>
										<td width="100px">上传图片</td>
										<td>
											<s:file id="brandAdvs_brandImg_%{#i}" name="brandAdvs[%{#no}].brandImg" value=""  size="36" />
											<button id="clean_brandImg_${i}" type="button" >清除图档</button>
											<s:hidden id="brandAdvs_advPosition_%{#i}" name="brandAdvs[%{#no}].advPosition" value="%{#side}" />
											<s:hidden id="brandImgCorrect_%{#i}"></s:hidden>
											<s:hidden id="brandAdvs_brandImgName_%{#i}" name="brandAdvs[%{#no}].brandImgName" />
											<s:hidden id="brandAdvs_brandImgFolder_%{#i}" name="brandAdvs[%{#no}].brandImgFolder" />
											<s:if test="%{fieldErrors['brandAdvs_brandImg_' + (#i)] != null}">
												<br/><span id="Tip_brandAdvs_brandImg_${i}" class="msg rn" >
													<s:fielderror><s:param>brandAdvs_brandImg_${i}</s:param></s:fielderror>
												</span>
											</s:if>
											<s:else>
												<br/><span id="Tip_brandAdvs_brandImg_${i}" class="msg rn" style="display:none;"></span>
											</s:else>
										</td>
									</tr>
									<tr>
										<td>&nbsp;</td>
										<td><span class="txt-rd">图片规格：125x40 &lt; 5KB</span></td>
									</tr>
									<tr>
										<td>图片点击连结</td>
										<td>
											<s:textfield id="brandAdvs_brandImgLink_%{#i}" name="brandAdvs[%{#no}].brandImgLink" size="50" />
											<s:if test="%{fieldErrors['brandAdvs_brandImgLink_' + (#i)] != null}">
												<br/><span id="Tip_brandAdvs_brandImgLink_${i}" class="msg rn" >
													<s:fielderror><s:param>brandAdvs_brandImgLink_${i}</s:param></s:fielderror>
												</span>
											</s:if>
											<s:else>
												<br/><span id="Tip_brandAdvs_brandImgLink_${i}" class="msg rn" style="display:none;"></span>
											</s:else>
										</td>
									</tr>
									<tr>
										<td>&nbsp;</td>
										<td><span class="txt-rd">ex:http://www.yaodian100.com</span></td>
									</tr>
									<tr>
										<td>广告代码</td>
										<td>
											<s:textfield id="brandAdvs_brandImgAdWord_%{#i}" name="brandAdvs[%{#no}].brandImgAdWord" size="50" />
										</td>
									</tr>
									<tr>
										<td class="partition2">&nbsp;</td>
										<td class="partition2"><span class="txt-rd">非必填。由英数字组成，最多25个半角</span></td>
									</tr>
									<s:iterator value="#adv.products" var="prod" status="sidx" >
										<s:set name="sno" value="%{#sidx.index}" />
										<s:set name="si" value="%{#sidx.index + 1}" />
									<tr>
										<td colspan="2" class="<s:property value="%{#sno==2?'':'partition2'}" />">
											<ul>
												<li><span class="txt-red">*</span> 商品编号（<s:property value="prodSite[#sno]" />）<input type="hidden" id="prod_site_${i}_${si}" value="<s:property value="prodSite[#sno]" />" /></li>
												<li style="margin-bottom: 8px"><s:hidden id="prodIsOk_%{#i}_%{#si}" />
													<div style="overflow: hidden;">
														<s:textfield id="brandAdvs_products_prodId_%{#i}_%{#si}" name="brandAdvs[%{#no}].products[%{#sno}].prodId" size="50" tabindex="%{#i}%{#si}" />
														<br/><span id="Tip_brandAdvs_products_prodId_${i}_${si}" class="msg rn" style="display:none;"></span>
													</div>
												</li>
												<li><span class="txt-red">*</span> 商品小标</li>
												<li style="margin-bottom: 8px">
													<div style="overflow: hidden;">
														<s:textfield id="brandAdvs_products_brief_%{#i}_%{#si}" name="brandAdvs[%{#no}].products[%{#sno}].brief" size="50" maxlength="22" />
														<span class="txt-rd">11字內</span>
														<br/><span id="Tip_brandAdvs_products_brief_${i}_${si}" class="msg rn" style="display:none;"></span>
													</div>
												</li>
												<li><span class="txt-red">*</span> 商品名称</li>
												<li style="margin-bottom: 8px">
													<div style="overflow: hidden;">
														<s:textfield id="brandAdvs_products_prodName_%{#i}_%{#si}" name="brandAdvs[%{#no}].products[%{#sno}].prodName" size="50" maxlength="44" />
														<span class="txt-rd">22字內</span>
														<br/><span id="Tip_brandAdvs_products_prodName_${i}_${si}" class="msg rn" style="display:none;"></span>
													</div>
												</li>
												<li>广告代码（非必填。由英数字组成，最多25个半角）</li>
												<li>
													<s:textfield id="brandAdvs_products_adWord_%{#i}_%{#si}" name="brandAdvs[%{#no}].products[%{#sno}].adWord" size="50" />
												</li>
											</ul>
										</td>
									</tr>
									</s:iterator>
								</table>
							</td>
							<s:if test="%{(#i)%2==0}"></tr></s:if>
						</s:iterator>
					</table>
				</td>
			</tr>
			<tr>
				<th>修改记录</th>
				<td>
					<p>建立：<fmt:formatDate value="${createDate}" pattern="yyyy-MM-dd HH:mm"/> / ${createUser}</p>
					<p>修改：<fmt:formatDate value="${modifyDate}" pattern="yyyy-MM-dd HH:mm"/> / ${modifyUser}</p>
				</td>
			</tr>
			<tr>
				<td colspan="2">
					<div style="float: right;">
						<input type="hidden" id="advId" name="advId" value="${advId}"/>
						<input type="hidden" id="advStatus" name="advStatus" value="${advStatus}"/>
						<s:hidden id="doClone" name="doClone" />
						<input type="button" id="subBtn" name="subBtn" value="发送"/>
						<!-- <input type="button" id="draftBtn" name="draftBtn" value="草稿"/> -->
						<input type="button" id="canBtn" name="canBtn" value="暂停"/>
						<input type="button" id="bakBtn" name="bakBtn" value="回查询列表"/>
					</div>
				</td>
			</tr>
		</tbody>
	</table>
</s:form>